import React, {Component} from 'react';
import './index.css'

class Parent extends Component {
    render() {
        return (
            <div className='parent'>
                <p>我是parnt组件</p>
                <A render={(name) => <B name={name}/>}/>
                {/*<A>hello</A>*/}
            </div>
        );
    }
}

class A extends Component {
    state = {
        name: 'tom'
    }

    render() {
        const {name} = this.state
        return (
            <div className='a'>
                <p>我是A组件</p>
                {this.props.render(name)}
                {/*{this.props.children}*/}
            </div>
        );
    }
}

class B extends Component {
    render() {
        return (
            <div className='b'>
                <p>我是B组件,{this.props.name}</p>
            </div>
        );
    }
}

export default Parent;